<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Photos Uploader</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TODO : Dynamic description content -->	
<meta name="description" content="" />


<script src="<?php echo base_url() ?>javascript/lib/jquery-1.2.6.pack.js" type="text/javascript"></script>
<script src="<?php echo base_url() ?>javascript/lib/jquery.MultiFile.js" type="text/javascript"></script>
<script src="<?php echo base_url() ?>javascript/lib/interface.js" type="text/javascript"></script>
<script src="<?php echo base_url() ?>javascript/photoform.js" type="text/javascript"></script>
</head>`

<body>
		<fieldset>
			<legend>PhotosUploader</legend>

			<div>	
				Allowed extensions: jpg.
			</div>
			<div id="photosuploader">
				<?php if(isset($error)) echo $error;?>

				<?php echo form_open_multipart('photosuploader/uploadphoto');?>				
				<input onchange="coucou()" type="file" name="userfile" size="20"  />
						<br/>
					<input type="submit" value="Add Photo">
					
				</form>
			</div>
		</fieldset>
		<fieldset>
			<legend>Here display photos</legend>
			<div id="photos">
			<?php
			for($i=0;$i<sizeof($photos);$i++)
			{
				echo "<img src ='".$photos_directory.$photos[$i]->filename."' class=\"sortableitem\" >";
			}
			//id=\"photo_".$i.\"
			//echo "<span id=\"photos_counter\" value=".($i+1)."></span>";
			?>
			</div>
			</br>
				<input type="submit" value="Submit Album">
		</fieldset>

	<script type="text/javascript">
	$(document).ready(
		function () {
			$('div').Sortable(
				{
					accept : 		'sortableitem',
					helperclass : 	'sorthelper',
					activeclass : 	'sortableactive',
					hoverclass : 	'sortablehover',
					opacity: 		0.8,
					/*fx:				200,*/
					revert:			true,
					floats:			true,
					tolerance:		'pointer'
				}
			)
		}
	);
	</script>		
</body>
</html>